<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Photography Showcase</title>
    <link rel="stylesheet" href="styles.css" />
  </head>
  <body>
    <header>
      <div class="container">
        <h1>Photography Showcase</h1>
        <nav>
          <ul>
            <li><a href="#">Home</a></li>
            <li><a href="#">Gallery</a></li>
            <li><a href="#">About</a></li>
            <li><a href="#">Contact</a></li>
          </ul>
        </nav>
      </div>
    </header>

    <section class="hero">
      <div class="hero-text">
        <h2>Capturing Moments, Creating Memories</h2>
        <p>Explore the beauty of the world through my lens</p>
      </div>
    </section>

    <section class="gallery">
      <h2>My 作品</h2>
      <div class="gallery-grid">
        <div class="gallery-item">
          <img src="./image/1.png" alt="Photo 1" />
        </div>
        <div class="gallery-item">
          <img src="./image/2.png" alt="Photo 2" />
        </div>
        <div class="gallery-item">
          <img src="./image/3.png" alt="Photo 3" />
        </div>
        <div class="gallery-item">
          <img src="./image/4.png" alt="Photo 4" />
        </div>
        <div class="gallery-item">
          <img src="./image/5.png" alt="Photo 5" />
        </div>
        <div class="gallery-item">
          <img src="./image/6.png" alt="Photo 6" />
        </div>
        <div class="gallery-item">
          <img src="./image/7.png" alt="Photo 7" />
        </div>
        <div class="gallery-item">
          <img src="./image/8.png" alt="Photo 8" />
        </div>
        <div class="gallery-item">
          <img src="./image/9.png" alt="Photo 9" />
        </div>
        <div class="gallery-item">
          <img src="./image/10.png" alt="Photo 10" />
        </div>
        <div class="gallery-item">
          <img src="./image/11.png" alt="Photo 11" />
        </div>
        <div class="gallery-item">
          <img src="./image/12.png" alt="Photo 12" />
        </div>
        <div class="gallery-item">
          <img src="./image/13.png" alt="Photo 13" />
        </div>
        <div class="gallery-item">
          <img src="./image/14.png" alt="Photo 14" />
        </div>
        <div class="gallery-item">
          <img src="./image/15.png" alt="Photo 15" />
        </div>
        <div class="gallery-item">
          <img src="./image/16.png" alt="Photo 16" />
        </div>
        <div class="gallery-item">
          <img src="./image/17.png" alt="Photo 17" />
        </div>
        <div class="gallery-item">
          <img src="./image/18.png" alt="Photo 18" />
        </div>
        <!-- Add more photos as needed -->
      </div>
    </section>

    <footer>
      <p>&copy; 2024 Photography by 桂ICP备2024042532号-1. All Rights Reserved.</p>
    </footer>
  </body>
</html>
